﻿<template>
    <div>
        <div class="big_box">
            <el-table :data="treetableData"
                      style="width: 100%; "
                      row-key="Roid"
                      border
                      :tree-props="{children: 'children' }">
                <el-table-column prop="ame"
                                 label="模块名称"
                                 sortable>
                    <template slot-scope="scope">
                        <label v-if="BitPrid(scope.row.Roid)"> <b> {{scope.row.name}}</b>  </label>
                        <label v-else> {{scope.row.name}} </label>
                    </template>
                </el-table-column>
                <el-table-column prop="Ico"
                                 label="图标"
                                 sortable>
                    <template slot-scope="scope">
                        <i :class="scope.row.ico" style="font-size:30px"></i>
                    </template>
                </el-table-column>
                <el-table-column prop="Roid"
                                 label="权限数值">
                </el-table-column>
                <el-table-column prop="Url"
                                 label="URL链接">
                    <template slot-scope="scope">
                        <label v-if='scope.row.Url==null'>  无</label>
                        <label v-else> {{scope.row.Url}}</label>

                    </template>
                </el-table-column>
                <el-table-column prop="address"
                                 label="操作">
                    <template slot-scope="scope">
                        <el-button v-if="BitPrid(scope.row.Roid)" icon="el-icon-circle-plus-outline" @click="role_add(scope.row)" type="success" size="small">添加下级模块</el-button>
                        <el-button v-if=" (BitPrid(scope.row.Roid))"    icon="el-icon-edit" type="warning" size="small" @click="role_edit(scope.row)">编辑</el-button>
                        <el-button icon="el-icon-delete" type="danger" size="small" @click="role_dele(scope.row)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>




        <el-dialog title="添加下级模块"
                   :visible.sync="AddRoleShow"
                   width="40%">

            <el-form ref="form" :model="AddRole" label-width="80px">
                <el-form-item label="父级权限">
                    <el-input v-model="AddRole.parentId"  disabled ></el-input>
                </el-form-item>
                <el-form-item label="模块名称">
                    <el-input v-model="AddRole.name"></el-input>
                </el-form-item>
                <el-form-item label="图标">
                    <el-input v-model="AddRole.ico"></el-input>
                </el-form-item>
                <el-form-item label="权限数">
                    <el-input v-model="AddRole.Roid"></el-input>
                </el-form-item>
                <el-form-item label="URL连接">
                    <el-input v-model="AddRole.url"></el-input>
                </el-form-item>
            </el-form> 

            <span slot="footer" class="dialog-footer">
                <el-button @click="AddRoleShow = false">取 消</el-button>
                <el-button type="primary" @click="onAddSubmit">立即创建</el-button>
            </span>
        </el-dialog>


        <el-dialog title="修改模块"
                   :visible.sync="UpRoleShow"
                   width="60%">
              <el-form ref="form" :model="UpRole" label-width="80px">
            <el-form-item label="父级权限">
                <el-input v-model="UpRole.ParentId" disabled></el-input>
            </el-form-item>
            <el-form-item label="模块名称">
                <el-input v-model="UpRole.name"></el-input>
            </el-form-item>
            <el-form-item label="图标">
                <el-input v-model="UpRole.ico"></el-input>
            </el-form-item>
            <el-form-item label="权限数">
                <el-input v-model="UpRole.Roid"></el-input>
            </el-form-item>
            <el-form-item label="URL连接">
                <el-input v-model="UpRole.url"></el-input>
            </el-form-item>
            </el-form>

            <span slot="footer" class="dialog-footer">
                <el-button @click="UpRoleShow = false">取 消</el-button>
                <el-button type="primary" @click="onUpSubmit">修改</el-button>
            </span>
        </el-dialog>






    </div>
</template>
<script>
    export default {
        name: "ModuleManage",
        props: {

        },
        created() {

        },
        data() {
            return {
                AddRoleShow: false,
                UpRoleShow: false,
                treetableData: [],
                AddRole: {},
                UpRole: {},
            }
        },
        methods: {
            GetTreetable() {
                this.$http.get("/Right/GetInitDatale").then(res => {
                    this.treetableData = res.data.DicData;
                });
            },
            BitPrid(str) {
                return str.substring(2, 6) == "0000";
            },
            role_add(obj) {
                this.AddRoleShow = true;
                this.AddRole.FatherRoid = obj.Roid;
                console.log(this.AddRole);
            },
            role_edit(obj) {
                console.log(obj);
                this.UpRole = obj;
                this.UpRoleShow = true;
            },
            role_dele(obj) {
                this.$confirm('你确定要删除吗?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'error'
                }).then(res => {
                    console.log(obj);

                    this.$http.get("/Right/DeleModule?Roid=" + obj.Roid +"").then(res => {
                        if (res.data.succeed) {
                            this.$message.success("删除成功");
                            this.GetTreetable();
                        } else {
                            this.$message.warning("删除失败.");
                        }
                    });
                });
            },
            onAddSubmit() {
                this.$http.post("/Right/AddModule", { role: this.AddRole }).then(res => {
                    if (res.data.succeed) {
                        this.$message.success("添加成功");
                        this.GetTreetable();
                        this.AddRoleShow = false;
                    } else {
                        this.$message.warning("添加失败重新填写内容.");
                    }
                });
            },
            onUpSubmit() {

                this.$http.post("/Right/UpdateModule", { role: this.UpRole }).then(res => {
                    if (res.data.succeed) {
                        this.$message.success("修改数据成功");
                        this.GetTreetable();
                        this.UpRoleShow = false;
           
                    } else {
                        this.$message.warning("修改失败重新填写内容.");
                    }
                });
            },
        },
        mounted: function () {
            this.GetTreetable();
        },
    }
</script>




<style scoped>
    
</style>
